<template>
  <div class="app">
    <!--<input type="text" ref="inputRef"/>-->
    <input type="text" v-focus>
    <!--<h2 v-focus>哈哈哈</h2>-->
  </div>
</template>

<!--vue2的自定义局部指令写法-->
<!--<script>-->
<!--  export default {-->
<!--    directives:{-->
<!--      focus:{-->
<!--        // 生命周期函数（自定义指令）-->
<!--        mounted(el){ // el是使用v-focus的标签-->
<!--          console.log("v-focus应用的元素被挂在了",el)-->
<!--          el?.focus()-->
<!--        }-->
<!--      }-->
<!--    }-->
<!--  }-->
<!--</script>-->

<script setup>
  // // 方式一：定义ref绑定到input中，调用focus
  // import useInput from "./hooks/useInput.js"
  // const {inputRef} = useInput()

  // // 方式二：自定义指令（局部指令），必须定义一个'v'开头的标识符
  // const vFocus={
  //   mounted(el){
  //     el?.focus()
  //   }
  // }

</script>